<template>
	<edu-dialog :title="title" @open="onOpen" @close="onClose" ref="eduDialog" class="edu-message-box edu-export-dialog">
		<div class="text-center">
			<p>{{tip}}</p>
			<div class="mb-8px">
				<el-progress :text-inside="true" :stroke-width="18" :percentage="percentage"></el-progress>
			</div>
			<slot></slot>
		</div>
		<span slot="buttons">
			<el-button @click="close">{{$t('message.close')}}</el-button>
		</span>
	</edu-dialog>
</template>
<script>
import UTILS from "common/src/utils/utils";
/**
 * 对话框组件
 */
export default {
	name: "EduExportDialog",
	props: {
		title: {
			type: String,
			default: "提示"
		},
		tip: {
			type: String,
			default: "正在导出"
		},
		data: {
			type: Object,
			default: null
		},
		autoStatus:{default: false}
	},
	data() {
		return {};
	},
	computed: {
		percentage() {
			if (
				!_.isNil(this.data) &&
				!_.isNil(this.data.total) &&
				!_.isNil(this.data.doneCount)
			) {
				if (!_.isNil(this.data.updateCount)) {
					return _.round(
						((this.data.doneCount + this.data.updateCount) /
							this.data.total) *
							100,
						2
					);
				} else {
					return _.round(
						(this.data.doneCount / this.data.total) * 100,
						2
					);
				}
			} else  {
				return 0;
			}
		}
	},
	mounted() {},
	created() {},
	methods: {
		open() {
			this.$refs.eduDialog.open();
		},
		onOpen() {
			setTimeout(() => {
				this.$emit("open");
			}, 300);
		},
		close() {
			this.$refs.eduDialog.close();
		},
		onClose() {
			this.$emit("close");
		}
	}
};
</script>

<style lang="scss">
.edu-export-dialog.el-dialog__wrapper .el-dialog {
	display: block;
	min-width: 420px;
}
</style>
